<template>
  <div>
    <Button @click="doAdd" type="primary">加</Button>
    {{ conut }}
    <Button @click="doSub" type="primary">减</Button>
  </div>

</template>
<script lang="ts" setup>
import { ref } from "vue";
import { Button } from "ant-design-vue";
const conut = ref(0)
function doAdd() {
  conut.value++
}
function doSub() {
  conut.value--
}

</script> 
<style scoped lang="less">
.home-main {
  .banner {
    background: #364d79;
    overflow: hidden;

    img {
      width: 100%;
      height: auto;
      max-height: 360px;
    }
  }

  .home-body {
    width: @containerWidth;
    margin: 0 auto;
    display: flex;

    .right {
      width: 245px;
      overflow: hidden;
      padding-left: 14px;

      .title {
        margin-top: 14px;
        width: 205px;
        border-bottom: 2px solid #666;
        display: inline-block;
        line-height: 32px;
        height: 32px;
        font-size: 16px;
        font-weight: 700;
        color: #333;

        span {
          font-size: 12px;
          color: red;
        }
      }
    }

    .left {
      flex: 1;
      overflow: hidden;
    }

    ol {
      list-style: inside;
      padding: 0;
      height: 112px;
      overflow: auto;
    }

    li {
      list-style: inside;
      cursor: pointer;
      line-height: 26px;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
    }

    .link {
      width: 200px;
      margin-bottom: 10px;

      img {
        width: 100%;
        height: auto;
      }

      &:hover {
        transform: scale(0.95);
        transition: all 0.2s linear;
      }
    }
  }

  .form-box {
    display: flex;
    height: 60px;
    align-items: center;

    img {
      height: 45px;
      width: auto;
      margin-right: auto;
    }

    .label {
      font-size: 16px;
      font-weight: 700;
      padding-right: 12px;
    }

    .input {
      width: 490px;
      display: flex;
      justify-content: space-between;
      align-items: center;
    }
  }

  /deep/ .ant-input-group-addon {
    border-color: #64bf26;
    background: #64bf26;
    color: #fff;
  }

  /deep/.ant-input {
    border: 1px solid #64bf26;
    height: 32px;
    font-size: 12px;
  }

  .ant-btn {
    padding: 0 24px;
    border-color: #64bf26;
  }

  .html-box {
    // height: 460px;
    overflow: auto;
    overflow-x: hidden;
    padding-right: 20px;
  }

  .htmlarea {
    display: inline;
  }

  .html-img {
    float: left;
    width: 247px;
    height: 152px;
    margin: 0 5px -1px 0;
    overflow: hidden;
  }
}
</style>

